<template>
   <div>
      <button v-for="item in FunData" :key="item.id" class="NaviOne" @click="SETPUBLISHSTATE(item)">
          <img :src="require('@/assets/function/'+item.src)" >
          <div>{{item.title}}</div>
      </button>
   </div>
</template>
<script>
import { mapMutations } from 'vuex'
  export default 
  {
     name :'',
     data() {
        return {
            FunData:[
                {id:1,src:'Text.png',title:'图文',index:2},
                {id:2,src:'Video.png',title:'视频',index:3},
                {id:3,src:'MarkDown.png',title:'MD',index:4},
                // {id:4,src:'Draft.png',title:'草稿箱',index:5},
            ]
        }
     }, 
     methods:{
        ...mapMutations('Article',['SETPUBLISHSTATE'])
     }
  }
</script>
<style scoped lang='less'>
.NaviOne{
    width: 150px;height: 150px;
    background: rgba(255, 255, 255, 0.5);
    border-radius: 5px;
    margin: 10px;

    img{
        width: 70px;
        height: 70px;
    }

    div{
        font-size: 20px;
    }
}

</style>